<div id="subContainer" class="wrapper wrapper-content">
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>参数管理</h5>
            <div class="ibox-tools">
                <a :href="applicationContextRootPath + 'pages/material/add.html'"
                   data-pjax class="btn btn-primary btn-xs">新建参数</a>
            </div>
        </div>
        <div class="ibox-content">

            <div class="row">
                <div class="col-sm-9"></div>
                <div class="col-sm-3">
                    <div class="input-group">
                        <input type="text" placeholder="请输入关键词" class="input-sm form-control search-input" v-model="pageInfo.name">
                        <span class="input-group-btn">
                                        <button type="button" class="btn btn-sm btn-primary" v-on:click="pagequery()"> 搜索</button> </span>
                    </div>
                </div>
            </div>

            <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>参数名称</th>
                        <th>代码</th>
                        <th>参数值</th>
                        <th>最近一次修改</th>
                        <th>修改人</th>
                        <th>创建时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item, index) in items">
                        <th scope="row">{{(pageInfo.pageNum - 1) * 10 + index + 1}}</th>
                        <td>{{item.name}}</td>
                        <td>{{item.code}}</td>
                        <td>{{item.value}}</td>
                        <td>{{item.updateAt | formatDate}}</td>
                        <td>{{item.updator ? item.updator.username : ''}}</td>
                        <td>{{item.createdAt | formatDate}}</td>
                        <td>
                            <button type="button" v-on:click="edit(item)" class="btn btn-primary btn-xs">修改</button>
                            <button type="button" v-on:click="deleteItem(item)" class="btn btn-danger btn-xs">删除
                            </button>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <pageination :total="pageInfo.total" :size="pageInfo.pageSize" :page="pageInfo.page"
                         :changge="pageFn"></pageination>

        </div>
    </div>

</div>

<script src="/js/validateIsMain.js"></script>
<script>
    var vue = new Vue({
        el: '#subContainer',
        data: {
            applicationContextRootPath: '/',
            pageInfo: {
                page: 1,
                total: 0,//总页数
                pageSize: 15,//每页显示条目个数不传默认10
                master: [],//接受权限数组
                result: false//表示超级管理员权限
            },
            items: [{}]
        },
        created: function () {

        },
        methods: {
            pagequery: function () {
                var that = this;
                AJAX.GET('material', this.pageInfo, function (resp) {
                    that.items = resp.data.list;
                    that.pageInfo.page = resp.data.pageNum;
                    that.pageInfo.total = resp.data.total;
                })
            },
            pageFn: function (val) {
                this.pageInfo.pageNum = val;
                this.pagequery();
            },
            edit: function (item) {
                sessionStorage.setItem('editParams', item.id);
                $.pjax({
                    url: mvm.applicationContextRootPath + 'pages/material/edit.html',
                    container: '.page-container'
                });
            },
            deleteItem: function (item) {
                var that = this;
                confirm("删除后，不可恢复，请确认！", "", function (isConfirm) {
                    if (isConfirm) {
                        AJAX.DELETE('material', item, function (resp) {
                            toastr.success(resp.msg);
                            that.pagequery();
                        })

                    } else {
                        //after click the cancel
                    }
                }, {confirmButtonText: '确认', cancelButtonText: '取消', width: 400});

            }
        }
    });
</script>
